﻿<%@ Page Title="" Language="C#" MasterPageFile="~/html/MyBlog.Master" AutoEventWireup="true" CodeBehind="Comment.aspx.cs" Inherits="HelloLLLLL.Blog.html.Comment" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
     <link rel="stylesheet" href="../res/css/comment.css">
    <link rel="stylesheet" href="../res/css/article-detail.css">
    <link rel="stylesheet" href="../res/css/wangEditor.css">
    <link rel="stylesheet" href="../res/css/prettify.css">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <!-- require APlayer -->


      <div class="layui-container">
            <blockquote class="layui-elem-quote sitemap shadow">
                <i class="layui-icon">&#xe715;</i>
                <span class="layui-breadcrumb" lay-separator=">">
                    <a href="/html/Index.aspx">首页</a>
                    <a><cite>留言交流</cite></a>
                </span>
            </blockquote>
            <div class="layui-row layui-col-space15">
                <!-- 左边 -->
                <div class="layui-col-md8">
                    <div class="layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <div class="topdiv">
                                <div class="topdiv-figure">
                                    <img src="../res/images/messagewall.png" />
                                </div>
                                <p class="topdiv-nickname">留言板</p>
                                <p class="topdiv-introduce">可留言、可吐槽、可提问。欢迎灌水，杜绝广告！</p>
                            </div>
                        </div>
                         <div class="blog-card blog-card-padding shadow">
                        <fieldset class="layui-elem-field layui-field-title" style="margin-bottom:0">
                            
                                                       <div class="layui-field-box">
                                <form class="layui-form blog-editor" action="">
                                    <div class="layui-form-item">                                      
                                        <div class="layui-input-inline"  style="width:180px;margin-right:10px"> <input type="text" name="nick"  value=""  placeholder="昵称" class="layui-input"></div>
                                       <div class="layui-input-inline"  style="width:180px;margin-right:10px"> <input type="text" name="personEmail" value="" placeholder="邮箱" class="layui-input" ></div>
                                       <input type="text" name="personHome"  placeholder="个人主页http://" value="" class="layui-input" style="width:220px" >
                                        <textarea name="EditorContent" lay-verify="content" id="remarkEditor"
                                            placeholder="请输入内容" class="layui-textarea layui-hide"></textarea>
                                        <!-- 禁止评论 -->
                                        <!-- <div style="border:1px solid #f2f2f2;" class="emptybox">
                                            <p><i style="font-size:50px;color:#5fb878" class="layui-icon">&#x1007;</i>
                                            </p>
                                            <p>该文章已禁止评论</p>
                                        </div> -->
                                    </div>
                                    <div class="layui-form-item">
                                        <button class="layui-btn" lay-submit="formRemark1"
                                            lay-filter="formRemark1">提交留言</button>
                                    </div>
                                </form>
                            </div>

                        </fieldset>
                        <ul class="blog-comment">
                            <%if (null != ListParent)
                                    { %>
                            <%for (int m = 0; m < ListParent.Count; m++)
                                    {%>
                            
                            
                            <li>
                                <div class="comment-parent">
                                    <a name="remark-@item.Id"></a>
                                    <img src="../res/images/Leo.jpg" alt="<%=ListParent[m].Pubnisher %>" />
                                    <div class="info">
                                        <span class="username"><%=ListParent[m].Pubnisher %></span>
                                    </div>
                                    <div class="content"><%=ListParent[m].Content %></div>
                                    <p class="info info-footer"><span class="time"><%=ListParent[m].CTime%></span><a href="javascript:;" class="btn-reply" data-targetid="<%=ListParent[m].Id %>" data-targetname="<%=ListParent[m].Pubnisher %>">回复</a></p>
                                </div>
                                <hr />
                                
                                <%=LoopList(ListParent[m].ChildPL, ListParent[m].Pubnisher, ListParent[m].Id) %>
                                <%Sb.Clear(); %>
                                 <!-- 回复编辑器 -->    
                                <div class="replycontainer layui-hide">
                                    <form class="layui-form" action="">
                                        <div class="layui-form-item">
                                       
                                        <div class="layui-input-inline"  style="width:180px;margin-right:10px"> <input type="text" name="nick"  value=""  placeholder="昵称" class="layui-input"></div>
                                       <div class="layui-input-inline"  style="width:180px;margin-right:10px"> <input type="text" name="personEmail" value="" placeholder="邮箱" class="layui-input" ></div>
                                       <input type="text" name="personHome"  placeholder="个人主页http://" value="" class="layui-input" style="width:220px" >
                                        <input type="hidden"  name="targetUserId" />
                                        <!-- 禁止评论 -->
                                        <!-- <div style="border:1px solid #f2f2f2;" class="emptybox">
                                            <p><i style="font-size:50px;color:#5fb878" class="layui-icon">&#x1007;</i>
                                            </p>
                                            <p>该文章已禁止评论</p>
                                        </div> -->
                                    </div>
                                        <div class="layui-form-item"><textarea name="replyContent" lay-verify="replyContent" placeholder="请输入回复内容" class="layui-textarea" style="min-height:80px;"></textarea>
                                        </div>
                                        <div class="layui-form-item">
                                            <button class="layui-btn layui-btn-xs" lay-submit="formReply" lay-filter="formReply">提交</button>
                                        </div>
                                    </form>
                                </div>
                                 </li>
                               <%}
                                    }%>
                              
                           
                           
                        </ul>
                       
                        <!-- 没有评论 -->
                        <!-- <div class="emptybox">
                            <p><i style="font-size:50px;color:#5fb878" class="layui-icon"></i></p>
                            <p>暂无评论，大侠不妨来一发？</p>
                        </div> -->
                    </div>
                    </div>
                </div>
                <!-- 左边END -->
                <!-- 右边 -->
                <div class="layui-col-md4">
                    <div class="layui-row layui-col-space10">
                        <div class="layui-md-12 layui-hide-xs">
                            <div class="layui-card chatroom sr-bottom">
                                <!-- require APlayer -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>

<meting-js
	server="netease"
	type="playlist"
	id="3136952023"
    order="random"
    autoplay="true">
</meting-js>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 右边END -->
            </div>
        </div>
     <!-- 本页特有 -->
    <script type="text/javascript">
        var  $;
       
       
        layui.use(['layer', 'form'], function () {
            $ = layui.$;
            var form = layui.form
                , device = layui.device();
          
          

            //回复按钮点击事件
            $('.btn-reply').on('click', function () {
                var targetId = $(this).data('targetid')
                    , targetName = $(this).data('targetname')
                    , $container = $(this).parent('p').parent().siblings('.replycontainer');
               
                if ($(this).text() == '回复') {
                    $container.find('textarea').attr('placeholder', '回复【' + targetName + '】');
                    $container.removeClass('layui-hide');
                    $container.find('input[name="targetUserId"]').val(targetId);
                    $(this).parents('.blog-comment li').find('.btn-reply').text('回复');
                    $(this).text('收起');
                } else {
                    $container.addClass('layui-hide');
                    $container.find('input[name="targetUserId"]').val(0);
                    $(this).text('回复');
                }
            });

            //监听留言回复提交
            form.on('submit(formReply)', function (data) {
                if ($(data.elem).hasClass('layui-btn-disabled')) {
                    return false;
                }
                //alert(JSON.stringify(data.field));
                //console.log(JSON.stringify(data.field));
                //return false;
                var index = layer.load(1);
                $.ajax({
                    type: 'post',
                    url: '/FrontEnd.ashx?action=replyMessage',
                    data: data.field,
                    
                    success: function (res) {
                        layer.close(index);
                        if (res.code === 1) {
                            layer.msg(res.msg, { icon: 6 });
                            setTimeout(function () {
                                location.reload(true);
                            }, 500);
                        } else {
                            if (res.msg != undefined) {
                                layer.msg(res.msg, { icon: 5 });
                            } else {
                                layer.msg('程序异常，请重试或联系作者', { icon: 5 });
                            }
                        }
                    },
                    error: function (e) {
                        layer.close(index);
                        layer.msg("请求异常", { icon: 2 });
                    }
                });
                return false;
            });


            //监听评论提交
            form.on('submit(formRemark1)', function (data) {

                if (data.field.EditorContent == "" || data.field.EditorContent == undefined) {
                    return false;
                }

                //alert(JSON.stringify(data.field));
                if ($(data.elem).hasClass('layui-btn-disabled'))
                    return false;
                var index = layer.load(1);
                $.ajax({
                    type: 'post',
                    url: '/FrontEnd.ashx?action=leaveMessage',
                    data: data.field,
                    success: function (res) {
                        layer.close(index);
                        if (res.code === 1) {
                            layer.msg(res.msg, { icon: 6 });
                            location.reload(true);
                        } else {
                            if (res.msg != undefined) {
                                layer.msg(res.msg, { icon: 5 });
                            } else {
                                layer.msg('程序异常，请重试或联系作者', { icon: 5 });
                            }
                        }
                    },
                    error: function (e) {
                        layer.close(index);
                        if (e.status === 401) {
                            layer.msg("请先登录", { shift: 6, icon: 5 });
                        } else {
                            layer.msg("请求异常", { shift: 6, icon: 2 });
                        }
                    }
                });
                return false;
            });

        });
    </script>
</asp:Content>
